<template>
  <div class="clickInfo-content">
    <el-dialog v-model="dialogVisible" :title="title" width="500" @close="closeDialog">
      <template v-if="type ==='locate'">
        <dialogLocate :info="info"></dialogLocate>
      </template>
      <template v-else-if="type==='carmera'">
        <dialogCarmera :info="info"></dialogCarmera>
      </template>

    </el-dialog>
  </div>
</template>
<script setup>
import { ref } from "vue";
import dialogLocate from "./dialogLocate.vue";
import dialogCarmera from "./dialogCarmera.vue";
const dialogVisible = ref(false);

const open = () => {
  dialogVisible.value = true;
};
const closeDialog=()=>{
  emit('close')
}
defineExpose({
  open,
});
const emit = defineEmits(["close"]);
const props = defineProps({
  info: {
    type: Object,
    default: () => {},
  },
  type: {
    type: String,
    default: "",
  },
  title: {
    type: String,
    default: "",
  },
});

</script>
<style lang="scss">
.el-dialog {
  background-color: #2b2c2f !important;
  padding: 0px !important;
}
.el-dialog__header {
  padding-bottom: 0 !important;
  background-color: #313235 !important;
  border-bottom: 1px solid #424a5e;
  height: 40px;
  padding: 0 15px;
  line-height: 40px;
}
.el-dialog__title {
  color: #fff !important;
  font-size: 14px !important;
}
.el-dialog__body {
  color: #fff !important;
}

</style>
